<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
      <#include "/common/elibs.html">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
  </head>
  <script>var index;
  </script><body>
    <div class="x-body">
        <form class="layui-form">
            <div class="layui-form-item">
                <label for="customerName" class="layui-form-label">
                    <span class="x-red">*</span>客户名称
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="customerName" name="customerName" lay-verify="required" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="customerAddress" class="layui-form-label">
                    <span class="x-red">*</span>客户地址
                </label>
                <div class="layui-input-inline">
                    <select id="customerProvinces" name="customerProvinces"
                            style="width: 200px;    margin-bottom: 10px;" lay-verify="required" value=""  lay-filter="customerProvinces">
                        <option value="0">请选择省份</option>
                    </select>
                    <select id="customerCities" name="customerCities"
                            style="width: 200px;    margin-bottom: 10px;" lay-verify="required" value="" lay-filter="customerCities">
                        <option value="0">请选择城市</option>
                    </select>
                    <select id="customerCounties" name="customerCounties"
                            style="margin-bottom: 10px;" value="" >
                        <option value="0">请选择区域</option>
                    </select>
                    <input type="text" id="customerAddress" name="customerAddress" lay-verify="required" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item" >
                <label for="customerContacts" class="layui-form-label">
                    <span class="x-red">*</span>联系人
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="customerContacts" name="customerContacts" lay-verify="required" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="customerPhone" class="layui-form-label">
                    <span class="x-red">*</span>联系电话
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="customerPhone" name="customerPhone" lay-verify="required" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item" id="electricTotalCapacity">

            </div>

            <div class="layui-form-item">
                <label for="voltageGrade" class="layui-form-label">
                    <span class="x-red">*</span>电压等级
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="voltageGrade" name="voltageGrade" lay-verify="required" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="oneTime" class="layui-form-label">
                    <span class="x-red">*</span>第一阶段时长
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="oneTime" name="oneTime" lay-verify="number" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="idxOneOperator" class="layui-form-label">
                    <span class="x-red">*</span>第一阶段操作人
                </label>
                <div class="layui-input-inline">
                    <select id="idxOneOperator" name="idxOneOperator" lay-verify="required">
                        <option>请选择</option>
                    </select>
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>


            <div class="layui-form-item">
                <label for="twoTime" class="layui-form-label">
                    <span class="x-red">*</span>第二阶段时长
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="twoTime" name="twoTime" lay-verify="number" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="idxTwoOperator" class="layui-form-label" >
                    <span class="x-red">*</span>第二阶段操作人
                </label>
                <div class="layui-input-inline">
                    <select id="idxTwoOperator" name="idxTwoOperator" lay-verify="required">
                        <option>请选择</option>
                    </select>
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>


            <div class="layui-form-item">
                <label for="threeTime" class="layui-form-label">
                    <span class="x-red">*</span>第三阶段时长
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="threeTime" name="threeTime" lay-verify="number" placeholder="请输入"
                           autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="idxThreeOperator" class="layui-form-label">
                    <span class="x-red">*</span>第三阶段操作人
                </label>
                <div class="layui-input-inline">
                    <select id="idxThreeOperator" name="idxThreeOperator" lay-verify="required">
                        <option>请选择</option>
                    </select>
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>第二阶段流程选择
                </label>
                <div class="layui-input-inline">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 155px;">间隔审批</label>
                        <div class="layui-input-block">

                            <input type="radio" name="funIntervalApprovalState"
                                   lay-verify="otherReq" lay-filter="funIntervalApprovalState" value="1" title="是">
                            <input type="radio" name="funIntervalApprovalState"
                                   lay-verify="otherReq" lay-filter="funIntervalApprovalState" value="0" title="否" >
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 155px;">申请双重编号</label>
                        <div class="layui-input-block">
                            <input type="radio" name="funDoubleHeavyState"
                                   lay-verify="otherReq" lay-filter="funDoubleHeavyState"  value="1" title="是">
                            <input type="radio" name="funDoubleHeavyState"
                                   lay-verify="otherReq" lay-filter="funDoubleHeavyState"  value="0" title="否" >
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 155px;">告知条形码申请</label>
                        <div class="layui-input-block">
                            <input type="radio" name="funInformState"
                                   lay-verify="otherReq" lay-filter="funInformState"  value="1" title="是">
                            <input type="radio" name="funInformState"
                                   lay-verify="otherReq" lay-filter="funInformState"  value="0" title="否" >
                        </div>
                    </div>
                    <!--<div class="layui-form-item">
                        <label class="layui-form-label" style="width: 155px;">告知高可靠性费用收取</label>
                        <div class="layui-input-block">
                            <input type="radio" name="funHighChargeState"
                                   lay-verify="otherReq" lay-filter="funHighChargeState"  value="1" title="是">
                            <input type="radio" name="funHighChargeState"
                                   lay-verify="otherReq"  lay-filter="funHighChargeState" value="0" title="否" >
                        </div>
                    </div>-->
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 155px;">保护定值报送</label>
                        <div class="layui-input-block">
                            <input type="radio" name="funFixedValuePresentationState"
                                   lay-verify="otherReq" lay-filter="funFixedValuePresentationState" value="1" title="是">
                            <input type="radio" name="funFixedValuePresentationState"
                                   lay-verify="otherReq" lay-filter="funFixedValuePresentationState" value="0" title="否" >
                        </div>
                    </div>
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="customerName" class="layui-form-label">
                </label>
                <button  class="layui-btn" lay-filter="preservation" type=button codeTyle="1" lay-submit="">
                    保存
                </button>
                <button  class="layui-btn" lay-filter="preAdd" type=button codeTyle="2" lay-submit="">
                    预提交
                </button>
                <button  class="layui-btn" lay-filter="add" type=button codeTyle="3" lay-submit="">
                    提交
                </button>
            </div>
      </form>
    </div>
    <script>

        function addEm(){
            var html = '<div class="layui-form-item template" >'+
                '<label  class="layui-form-label">'+
                '<span class="x-red">*</span>报装容量'+
                '</label>'+
                '<div class="layui-input-inline">'+

                '<input style="width: 200px;float: left;margin-bottom: 10px;" type="text" name="numberBYQ" lay-verify="required" placeholder="变压器台数" autocomplete="off" class="layui-input" lay-verify="number" >'+
                '<input style="width: 200px;float: left;margin-left: 12px;margin-bottom: 10px;" type="text" name="capacityBYQ" lay-verify="required" placeholder="变压器容量" autocomplete="off" class="layui-input" lay-verify="number" >'+
                '<input style="width: 200px;float: left;margin-bottom: 10px;" type="text" name="numberDDJ" lay-verify="required" placeholder="电动机台数" autocomplete="off" class="layui-input" lay-verify="number" >'+
                '<input style="width: 200px;float: left;margin-left: 12px;margin-bottom: 10px;" type="text" name="capacityDDJ" lay-verify="required" placeholder="电动机容量" autocomplete="off" class="layui-input" lay-verify="number" >'+
                '</div>'+
                '<div class="layui-form-mid layui-word-aux">'+
                '<a href="#" onclick="addEm()"><i class="icon iconfont">&#xe6b9;</i></a>'+
                '<a href="#" onclick="deleteTemp(this)"><i class="icon iconfont">&#xe6fe;</i></a>'+
                '</div>'+
                '</div>';
            $("#electricTotalCapacity").append(html);
        }
        $(function(){
            $("#electricTotalCapacity").append("");
            addEm();
        })

        function deleteTemp(o){
            $(o).parent().parent().remove();
        }


        layui.use(['form','layer'], function() {
            $ = layui.jquery;
            var form = layui.form
                , layer = layui.layer, layedit = layui.layedit;

            //用户信息
            ajaxFun('get','/pc/user/getUserInfoListAll',null,function(data){
                if(data.code != 0){
                    alertFun(data);
                }else{
                    var html = "<option value=''>请选择</option>";
                    $("#idxOneOperator").html("");
                    $("#idxTwoOperator").html("");
                    $("#idxThreeOperator").html("");
                    for(var i=0;i<data.data.length;i++){
                        html += "<option value='"+data.data[i].userBaseInfoId+"'>"+data.data[i].nickName+"</option>";
                    }
                    $("#idxOneOperator").html(html);
                    $("#idxTwoOperator").html(html);
                    $("#idxThreeOperator").html(html);
                    form.render();
                }
            })
            //自定义验证规则
            form.verify({
                otherReq: function(value,item){
                    var $ = layui.$;
                    var verifyName=$(item).attr('name')
                        , verifyType=$(item).attr('type')
                        ,formElem=$(item).parents('.layui-form')//获取当前所在的form元素，如果存在的话
                        ,verifyElem=formElem.find('input[name='+verifyName+']')//获取需要校验的元素
                        ,isTrue= verifyElem.is(':checked')//是否命中校验
                        ,focusElem = verifyElem.next().find('i.layui-icon');//焦点元素
                    if(!isTrue || !value) {
                        //定位焦点
                        focusElem.css(verifyType == 'radio' ? {"color": "#FF5722"} : {"border-color": "#FF5722"});
                        //对非输入框设置焦点
                        focusElem.first().attr("tabIndex", "1").css("outline", "0").blur(function () {
                            focusElem.css(verifyType == 'radio' ? {"color": ""} : {"border-color": ""});
                        }).focus();
                        return '必填项不能为空';
                    }
                }
            });
            //联动省份
            getAddress(0,"customerProvinces");
            //监听级别
            form.on('select(customerProvinces)', function (data) {
                var value = data.value;
                $("#customerProvinces").val(value);
            });

            //联动 城市
            form.on('select(customerProvinces)', function (data) {
                var regionalPId = data.value;
                var param = $("#customerProvinces").val();
                if (regionalPId != '') {
                    getAddress(regionalPId,"customerCities");
                }
            });
            //监听级别
            form.on('select(customerCities)', function (data) {
                var value = data.value;
                $("#customerCities").val(value);
            });

            //联动 区域
            form.on('select(customerCities)', function (data) {
                var regionalPId = data.value;
                var param = $("#customerCities").val();
                if (regionalPId != '') {
                    getAddress(regionalPId,"customerCounties");
                }
            });
            //监听级别
            form.on('select(customerCounties)', function (data) {
                var value = data.value;
                $("#customerCounties").val(value);
            });

            //监听级别
            form.on('select(idxOneOperator)', function (data) {
                var value = data.value;
                $("#idxOneOperator").val(value);
            });
            //监听级别
            form.on('select(idxTwoOperator)', function (data) {
                var value = data.value;
                $("#idxTwoOperator").val(value);
            });
            //监听级别
            form.on('select(idxThreeOperator)', function (data) {
                var value = data.value;
                $("#idxThreeOperator").val(value);
            });

            form.on('radio(funIntervalApprovalState)', function (data) {
                $("input[name='funIntervalApprovalState']").val(data.value);
            })
            form.on('radio(funDoubleHeavyState)', function (data) {
                $("input[name='funDoubleHeavyState']").val(data.value);
            })
            form.on('radio(funInformState)', function (data) {
                $("input[name='funInformState']").val(data.value);
            })
            /*form.on('radio(funHighChargeState)', function (data) {
                $("input[name='funHighChargeState']").val(data.value);
            })*/
            form.on('radio(funFixedValuePresentationState)', function (data) {
                $("input[name='funFixedValuePresentationState']").val(data.value);
            })

            //监听提交
            form.on('submit(add)', function (t) {
                addSubmit(3);
            });

            //监听保存
            form.on('submit(preservation)', function (t) {
                addSubmit(1);
            });

            //监听预提交
            form.on('submit(preAdd)', function (t) {
                addSubmit(2);
            });
        });

        function addSubmit(submitState){
            //统计包装容量
            var numberBYQ,capacityBYQ,numberDDJ,capacityDDJ,electricTotalCapacity = 0;
            $(".template").each(function(){
                numberBYQ = $(this).find("input[name=numberBYQ]").val();
                capacityBYQ = $(this).find("input[name=capacityBYQ]").val();

                numberDDJ = $(this).find("input[name=numberDDJ]").val();
                capacityDDJ = $(this).find("input[name=capacityDDJ]").val();

                electricTotalCapacity = electricTotalCapacity + parseInt(numberBYQ) * parseInt(capacityBYQ) +
                    parseInt(numberDDJ) * parseInt(capacityDDJ);
            })
            var params = {
                "idProAdmin":$("#idProAdmin").val(),
                //tcaDescribe : layui.layedit.getContent(index),
                "customerName": $("#customerName").val(),
                "customerCities": $("#customerCities").val(),
                "customerProvinces": $("#customerProvinces").val(),
                "customerCounties": $("#customerCounties").val(),
                "customerAddress": $("#customerAddress").val(),
                "customerContacts": $("#customerContacts").val(),
                "customerPhone": $("#customerPhone").val(),
                "voltageGrade": $("#voltageGrade").val(),
                "oneTime": $("#oneTime").val(),
                "idxOneOperator": $("#idxOneOperator").val(),
                "twoTime": $("#twoTime").val(),
                "idxTwoOperator": $("#idxTwoOperator").val(),
                "threeTime": $("#threeTime").val(),
                "idxThreeOperator": $("#idxThreeOperator").val(),
                "funIntervalApprovalState": $("input[name='funIntervalApprovalState']").val(),
                "funDoubleHeavyState": $("input[name='funDoubleHeavyState']").val(),
                "funInformState": $("input[name='funInformState']").val(),
                "funFixedValuePresentationState": $("input[name='funFixedValuePresentationState']").val(),
                "electricTotalCapacity":electricTotalCapacity,
                "submitState":submitState
            }
            if (true) {
                ajaxFun('post','/pc/project/addProject',params,function(data){
                    if (data.code != 0) {
                        alertFun(data);
                    } else {
                        window.location.href = path + "/modules/project/list.html";
                        console.log("success !");
                    }
                })
                return false;
            }
        }
    </script></body></html>